<%-- $Id: photoList_s.jsp 150 2011-07-26 02:09:02Z bs24event@gmail.com $ --%><%--
--%><%@page pageEncoding="UTF-8"%><%--
--%><%@ include file="/common/common.jsp"%><%--
--%><!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="robots" content="noindex,nofollow" />
<meta name="viewport" content="width=device-width , initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />
<link rel="stylesheet" href="/css/base_s.css" />
<link rel="stylesheet" href="/css/photoswipe.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
<script src="/js/jquery-1.6.1.min.js"></script>
<script src="/js/jquery.mobile-1.0b1.min.js"></script>
<script src="/js/simple-inheritance.min.js"></script>
<script src="/js/code-photoswipe-jQuery-1.0.18.min.js"></script>
<script src="/js/jquery.animate-enhanced.min.js"></script>
<title>Gyoujibook フォト一覧</title>
	<script type="text/javascript">
	$(function(){
		$('.gallery-item img').hide();
	});
	var i = 0;
	var int=0;
	$(window).bind("load", function() {
		var int=setInterval("doThis(i)",300);
	});
	function doThis() {
		var imgs = $('.gallery-item img').length;
		if (i >= imgs) {
			clearInterval(int);
		}
		$('.gallery-item img:hidden').eq(0).fadeIn(300);
		i++;
	}
	$(document).ready(function(){
		$("#gallery a").photoSwipe();
	});
	</script>
</head>
<body>
<div data-role="page" data-theme="b" class="gallery-page">
	<%-- ヘッダー --%>
	<%@ include file="/common/header_s.jsp"%>
	<%-- コンテンツ --%>
	<div id="content" data-role="content">
		<ul data-role="listview"><li data-role="list-divider">アルバム[<c:out value="${albumTitle}"/>]のフォト一覧 <span class="ui-li-count">${myPhotosCnt}枚</span></li></ul>
	</div><!-- contents end -->
	<div id="gallery">
	<c:forEach var="photo" items="${myPhotos}" varStatus="status">
		<c:if test="${status.count == 1 || (status.count-1)%3 == 0 }"><div class="gallery-row"></c:if>
			<div class="gallery-item"><a href="${photo.photoUrl}" title="${photo.caption}" rel="external" class="photo"><img src="${photo.thumbUrl}" alt="${status.count}/${myPhotosCnt} page" /></a></div>
		<c:if test="${status.count%3 == 0 || myPhotosCnt == status.count}"></div></c:if>
	</c:forEach>
	</div>
	<%-- フッター --%>
	<%@ include file="/common/footer_s.jsp"%>
</div><!-- top end -->
</body>
</html>